<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/assets/view/base/tag.jsp" %>
<!DOCTYPE html>
<head>
    <title>mrcode</title>
    <jsp:include page="/assets/view/common/head-meta.jsp"/>
    <jsp:include page="/assets/view/common/head-ui.jsp"/>

</head>
<body>
<jsp:include page="/assets/view/common/header.jsp"/>
<div class="container setavator">

    <jsp:include page="../manage/menu.jsp"/>
    <div class="row">
        <div class="col-md-10" id="right">
            <h3>个人图片</h3>

            <div class="row">
                <div class="col-sm-6 mb-xs-30 mb-40 mb-sm-20">
                    <div class="img-grxx align-center">
                        <div class="img-grxx-image">
                            <img id="img-grxx" src="${contextPath}${sessionScope.USER_INFO.blogConfig.blogShow}"/>
                        </div>
                    </div>
                    <div class="align-center">
                        <a id="img-grxx-set" class="submit_btn btn btn-mod btn-medium btn-round">
                                    <span class="icon-picture">
                                </span>上传博客秀
                        </a>
                    </div>
                </div>
                <div class="col-sm-6 mb-xs-30 mb-40 mb-sm-20">
                    <div class="img-grtx">
                        <div class="img-grtx-image">
                            <img id="img-grtx" src="<%--${contextPath}--%>${user.headImg}"/>
                        </div>
                    </div>
                    <div class="align-center">
                        <a id="img-grtx-set" class="align-center btn btn-mod btn-medium btn-round">
                                    <span class="icon-picture">
                                </span>上传头像
                        </a>
                    </div>
                </div>

            </div>

            <div id="grxx-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content align-center">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                    aria-hidden="true">&times;</span>
                            </button>
                            <h4 class="modal-title">
                                上传博客秀
                                <div class="text-warning"><span class="icon-exclamation-sign"></span>图片上传测试成功的有火狐、chroom浏览器,其他的暂时不支持</div>
                            </h4>
                        </div>
                        <div class="modal-body">
                            <div id="grxx-cropper" class="row">
                                <div class="col-md-6">
                                    <div class="cropit-image-preview-container">
                                        <div class="cropit-image-preview"></div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <input id="gxxx_fileInput" type="file" class="cropit-image-input"/>
                                    <a id="gxxx_fileInput_btn" class="btn btn-success">
                                        <span class="icon-picture"></span>
                                        选择图片
                                    </a>

                                    <div class="slider-wrapper mb-40 mb-sm-20 mt-40 mt-sm-20">
                                        <span class="icon-picture icon-large"></span>
                                        <input type="range" class="cropit-image-zoom-input custom" min="0" max="1"
                                               step="0.01">
                                        <span class="icon-picture icon-2x" style="vertical-align: middle;"></span>
                                    </div>
                                    <a id="grxxSubmit" class="submit_btn btn btn-mod btn-medium btn-round">
                                        保存设置
                                    </a>

                                    <div id="notice">

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="grtx-modal" class="modal fade" tabindex="-1" role="dialog">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content align-center">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                    aria-hidden="true">&times;</span>
                            </button>
                            <h4 class="modal-title">
                                上传个人头像
                                <div class="text-warning"><span class="icon-exclamation-sign"></span>图片上传测试成功的有火狐、chroom浏览器,其他的暂时不支持</div>
                            </h4>
                        </div>
                        <div class="modal-body">
                            <div id="grtx-cropper" class="row">
                                <div class="col-md-6">
                                    <div class="cropit-image-preview-container">
                                        <div class="cropit-image-preview"></div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <input id="grtx_fileInput" type="file" class="cropit-image-input"/>
                                    <a id="grtx_fileInput_btn" class="btn btn-success">
                                        <span class="icon-picture"></span>
                                        选择图片
                                    </a>

                                    <div class="slider-wrapper mb-40 mb-sm-20 mt-40 mt-sm-20">
                                        <span class="icon-picture icon-large"></span>
                                        <input type="range" class="cropit-image-zoom-input custom" min="0" max="1"
                                               step="0.01">
                                        <span class="icon-picture icon-2x" style="vertical-align: middle;"></span>
                                    </div>
                                    <a id="grtxSubmit" class="submit_btn btn btn-mod btn-medium btn-round">
                                        保存设置
                                    </a>

                                    <div id="grtx_notice">

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
    <jsp:include page="/assets/view/common/footer.jsp"/>
    <script src="${contextPath}/assets/js/mangaerComm.js"></script>
    <script src="${contextPath}/assets/lib/jquery/cropit/jquery.cropit.js"></script>

    <script src="${contextPath}/assets/js/setavator.js"></script>
    <script>
        $("#setavator").addClass("active");
    </script>

</body>
</html>
